import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types';

const TrafficSituationMeta: IPublicTypeComponentMetadata = {
  componentName: 'TrafficSituation',
  title: '周边交通情况',
  category: '数据展示2',
  group: '出行服务',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: 'hzdz-charts',
    version: '0.1.0',
    exportName: 'TrafficSituation',
    main: 'src/index.tsx',
    destructuring: true,
    subName: ''
  },
  props: [
    {
      name: 'ref',
      propType: 'object',
    },
    {
      name: 'key',
      propType: 'string',
    },
    {
      name: 'style',
      propType: 'object',
    },
  ],
  configure: {
    props: [
      // 基础属性
      {
        name: 'basic',
        type: 'group',
        display: 'accordion',
        title: {
          label: '基础属性',
        },
        items: [
          {
            name: 'width',
            title: {
              label: '宽度',
              tip: '组件宽度'
            },
            setter: 'NumberSetter',
            defaultValue: 800,
          },
          {
            name: 'height',
            title: {
              label: '高度',
              tip: '组件高度'
            },
            setter: 'NumberSetter',
            defaultValue: 400,
          },
          {
            name: 'noResponsiveScale',
            title: {
              label: '禁用响应式缩放',
              tip: '当父容器有缩放时，禁用子组件的响应式缩放'
            },
            setter: 'BoolSetter',
            defaultValue: false,
          },

        ]
      },
      // TitleHeader 组件配置
      {
        name: 'titleHeader',
        type: 'group',
        display: 'accordion',
        title: {
          label: '标题配置',
        },
        items: [
          {
            name: 'titleHeader.title',
            title: {
              label: '标题文字',
              tip: '标题头部显示的文字'
            },
            setter: 'StringSetter',
            defaultValue: '周边交通情况',
          }
        ]
      },
      // 拥堵等级配置
      {
        name: 'congestionLevels',
        type: 'group',
        display: 'accordion',
        title: {
          label: '拥堵等级配置',
        },
        items: [
          {
            name: 'congestionLevels.level1',
            title: {
              label: '第一行第一个',
              tip: '南北平台拥堵等级'
            },
            setter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'title',
                      title: '标题',
                      setter: 'StringSetter',
                      defaultValue: '南北平台拥堵等级'
                    },
                    {
                      name: 'level',
                      title: '等级值',
                      setter: 'StringSetter',
                      defaultValue: '1.5'
                    },
                    {
                      name: 'showIcon',
                      title: '显示图标',
                      setter: 'BoolSetter',
                      defaultValue: true
                    },
                    {
                      name: 'iconPath',
                      title: '图标路径',
                      setter: 'StringSetter',
                      defaultValue: 'http://localhost:8085/static/images/chuxingfuwu/bj30.png'
                    },
                    {
                      name: 'backgroundImage',
                      title: '背景图片路径',
                      setter: 'StringSetter',
                      defaultValue: 'http://localhost:8085/static/images/chuxingfuwu/jx2.png'
                    }
                  ]
                }
              }
            }
          },
          {
            name: 'congestionLevels.level2',
            title: {
              label: '第一行第二个',
              tip: '东西平台拥堵等级'
            },
            setter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'title',
                      title: '标题',
                      setter: 'StringSetter',
                      defaultValue: '东西平台拥堵等级'
                    },
                    {
                      name: 'level',
                      title: '等级值',
                      setter: 'StringSetter',
                      defaultValue: '2.1'
                    },
                    {
                      name: 'showIcon',
                      title: '显示图标',
                      setter: 'BoolSetter',
                      defaultValue: true
                    },
                    {
                      name: 'iconPath',
                      title: '图标路径',
                      setter: 'StringSetter',
                      defaultValue: 'http://localhost:8085/static/images/chuxingfuwu/bj30.png'
                    },
                    {
                      name: 'backgroundImage',
                      title: '背景图片路径',
                      setter: 'StringSetter',
                      defaultValue: 'http://localhost:8085/static/images/chuxingfuwu/jx2.png'
                    }
                  ]
                }
              }
            }
          },
          {
            name: 'congestionLevels.level3',
            title: {
              label: '第一行第三个',
              tip: '中央广场拥堵等级'
            },
            setter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'title',
                      title: '标题',
                      setter: 'StringSetter',
                      defaultValue: '中央广场拥堵等级'
                    },
                    {
                      name: 'level',
                      title: '等级值',
                      setter: 'StringSetter',
                      defaultValue: '1.8'
                    },
                    {
                      name: 'showIcon',
                      title: '显示图标',
                      setter: 'BoolSetter',
                      defaultValue: true
                    },
                    {
                      name: 'iconPath',
                      title: '图标路径',
                      setter: 'StringSetter',
                      defaultValue: 'http://localhost:8085/static/images/chuxingfuwu/bj30.png'
                    },
                    {
                      name: 'backgroundImage',
                      title: '背景图片路径',
                      setter: 'StringSetter',
                      defaultValue: 'http://localhost:8085/static/images/chuxingfuwu/jx2.png'
                    }
                  ]
                }
              }
            }
          },
          {
            name: 'congestionLevels.level4',
            title: {
              label: '第二行第一个',
              tip: '北广场拥堵等级'
            },
            setter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'title',
                      title: '标题',
                      setter: 'StringSetter',
                      defaultValue: '北广场拥堵等级'
                    },
                    {
                      name: 'level',
                      title: '等级值',
                      setter: 'StringSetter',
                      defaultValue: '2.3'
                    },
                    {
                      name: 'showIcon',
                      title: '显示图标',
                      setter: 'BoolSetter',
                      defaultValue: true
                    },
                    {
                      name: 'iconPath',
                      title: '图标路径',
                      setter: 'StringSetter',
                      defaultValue: 'http://localhost:8085/static/images/chuxingfuwu/bj30.png'
                    },
                    {
                      name: 'backgroundImage',
                      title: '背景图片路径',
                      setter: 'StringSetter',
                      defaultValue: 'http://localhost:8085/static/images/chuxingfuwu/jx2.png'
                    }
                  ]
                }
              }
            }
          },
          {
            name: 'congestionLevels.level5',
            title: {
              label: '第二行第二个',
              tip: '南广场拥堵等级'
            },
            setter: {
              componentName: 'ObjectSetter',
              props: {
                config: {
                  items: [
                    {
                      name: 'title',
                      title: '标题',
                      setter: 'StringSetter',
                      defaultValue: '南广场拥堵等级'
                    },
                    {
                      name: 'level',
                      title: '等级值',
                      setter: 'StringSetter',
                      defaultValue: '1.9'
                    },
                    {
                      name: 'showIcon',
                      title: '显示图标',
                      setter: 'BoolSetter',
                      defaultValue: true
                    },
                    {
                      name: 'iconPath',
                      title: '图标路径',
                      setter: 'StringSetter',
                      defaultValue: 'http://localhost:8085/static/images/chuxingfuwu/bj30.png'
                    },
                    {
                      name: 'backgroundImage',
                      title: '背景图片路径',
                      setter: 'StringSetter',
                      defaultValue: 'http://localhost:8085/static/images/chuxingfuwu/jx2.png'
                    }
                  ]
                }
              }
            }
          }
        ]
      },
      // 样式属性
      {
        name: 'style',
        type: 'group',
        display: 'accordion',
        title: {
          label: '样式属性',
        },
        items: [
          {
            name: 'style',
            title: {
              label: '自定义样式',
            },
            setter: 'StyleSetter',
          },
          {
            name: 'className',
            title: {
              label: '自定义类名',
            },
            setter: 'StringSetter',
          }
        ]
      }
    ],
    supports: {
      style: true,
      className: true,
    },
    component: {
      isContainer: false,
      isModal: false,
    },
  },
  icon: 'https://img.alicdn.com/imgextra/i4/O1CN01XCiY1B1pxKv7K4j5j_!!6000000005426-2-tps-200-200.png',
};

const snippets: IPublicTypeSnippet[] = [
  {
    title: '周边交通情况',
    screenshot: '',
    schema: {
      componentName: 'TrafficSituation',
      props: {
        width: 500,
        height: 300,
        noResponsiveScale: false,

        titleHeader: {
          title: '周边交通情况'
        },
        congestionLevels: {
          level1: {
            title: '南北平台拥堵等级',
            level: '1.5',
            showIcon: true,
            iconPath: 'http://localhost:8085/static/images/chuxingfuwu/bj30.png',
            backgroundImage: 'http://localhost:8085/static/images/chuxingfuwu/jx2.png'
          },
          level2: {
            title: '东西平台拥堵等级',
            level: '2.1',
            showIcon: true,
            iconPath: 'http://localhost:8085/static/images/chuxingfuwu/bj30.png',
            backgroundImage: 'http://localhost:8085/static/images/chuxingfuwu/jx2.png'
          },
          level3: {
            title: '中央广场拥堵等级',
            level: '1.8',
            showIcon: true,
            iconPath: 'http://localhost:8085/static/images/chuxingfuwu/bj30.png',
            backgroundImage: 'http://localhost:8085/static/images/chuxingfuwu/jx2.png'
          },
          level4: {
            title: '北广场拥堵等级',
            level: '2.3',
            showIcon: true,
            iconPath: 'http://localhost:8085/static/images/chuxingfuwu/bj30.png',
            backgroundImage: 'http://localhost:8085/static/images/chuxingfuwu/jx2.png'
          },
          level5: {
            title: '南广场拥堵等级',
            level: '1.9',
            showIcon: true,
            iconPath: 'http://localhost:8085/static/images/chuxingfuwu/bj30.png',
            backgroundImage: 'http://localhost:8085/static/images/chuxingfuwu/jx2.png'
          }
        }
      }
    }
  }
];

export default {
  ...TrafficSituationMeta,
  snippets
}; 